Курс по jQuery основы 2017

Урок 0. Введение:
Приветствую Вас друзья. В данном видео я хотел бы представить Вам новый курс по изучению основ библиотеки jQuery.
Для тех, кто не знает jQuery – это специальная библиотека или фреймворк языка JavaScript, который значительно облегчает работу с элементами HTML страниц, то есть добавление новых элементов, изменение содержимого существующих, изменение атрибутов, стилей, реализация анимационных эффектов и т.д. При этом JQuery, позволяет создавать скрипты быстрее, эффективнее и главное кроссбраузерно.
Данный курс будет полезен всем, кто знаком с основами языка JavaScript и желает научиться использовать данный фреймворк для создания собственных скриптов или изменения уже существующих.
Изучение библиотеки мы начнем с абсолютного нуля, то есть, для начала, научимся выбирать элементы HTML страниц, используя инструменты jQuery, далее постепенно от урока к уроку будем изучать доступные методы, позволяющие осуществлять различные манипуляции с выбранными элементами. И конечно же в завершении, научимся отправлять асинхронные запросы, то есть использовать метод AJAX, потому как с jQuery – это очень удобно и легко.


Урок 1. Введение в jQuery. Начало работы:
От автора: приветствую Вас дорогой друг. С данного урока мы начинаем небольшой цикл уроков, посвященный изучению наиболее популярной библиотеки JavaScript, под названием jQuery. Это вводный урок, а значит, мы определимся, что это за библиотека, для чего она применяется, как и где ее скачать, и как начать с ней работать.
В данном видео Вы познакомитесь с главной функцией библиотеки jQuery, благодаря которой, можно выбрать интересующий элемент страницы HTML, для дальнейшей работы.


Урок 2. jQuery селекторы:
От автора: в данном уроке мы с Вами поговорим о том, что такое jQuery селекторы, благодаря которым осуществляется выборка интересующего элемента, или элементов на странице HTML, при помощи главной функции библиотеки. Что в свою очередь предоставляет доступ к объекту выбранного элемента, и к специальным методам, используя которые, Вы сможете выполнить необходимые манипуляции.
В данном видео Вы научитесь выбирать интересующие элементы HTML страниц при помощи библиотеки jQuery, используя селекторы. При этом Вы узнаете, что такое селекторы и каких видов они бывают. А так же узнаете, как использовать базовые селекторы и селекторы по атрибутам.


Урок 3. Селекторы группы фильтров:
От автора: на прошлом уроке мы с Вами изучили базовые селекторы библиотеки jQuery, тем самым научились осуществлять выборку элементов HTML страниц. В данном уроке мы поговорим о специальной группе фильтров, которые так же, по сути, являются селекторами, но их задача сводится к фильтрации выборки по определенным параметрам.
По итогам данного урока Вы научитесь использовать селекторы группы фильтров для более точной выборки интересующих элементов. А именно изучите простые фильтры, фильтры по содержимому и фильтры дочерних элементов.


Урок 4. Работа со стилями и атрибутами:
От автора: изучив селекторы и тем самым научившись выбирать при помощи библиотеки JQuery элементы страниц. Мы с Вами приступаем к рассмотрению методов, которые используются для непосредственной работы с выборкой. Поэтому в данном уроке мы поговорим об атрибутах и стилях тегов HTML и конечно же, инструментах фреймворка, которые доступны для работы с ними.
По итогам данного урока Вы научитесь получать и изменять значения различных атрибутов, классов и стилей элементов HTML. Узнаете, как взаимодействовать с ползунком полосы прокрутки, а так же как управлять позиционированием выбранных элементов.


Урок 5. Манипуляции с элементами и их содержимым:
От автора: на данном этапе Вы уже умеете работать с атрибутами и стилями выбранных элементов. Но зачастую необходимо манипулировать непосредственно содержимым. А значит, в данном видео мы рассмотрим методы jQuery благодаря которым получим возможность добавлять, изменять и удалять как простое текстовое содержимое элементов, так и более сложное состоящее из HTML тегов.
По итогам данного урока Вы узнаете, как добавлять, редактировать и удалять текстовое и HTML содержимое выбранных элементов.


Урок 6. Методы анимационных эффектов:
От автора: в данном видео мы рассмотрим манипуляции с выбранными элементами, используя методы различных анимационных эффектов. Потому как библиотека jQuery предоставляет удобные и очень простые в использовании способы создания пользовательских анимаций. При этом jQuery анимация строится на плавном изменении стилей CSS для выбранных элементов за заданный промежуток времени.
По итогам данного урока Вы узнаете как создаются различные анимационные эффекты при работе с выбранными элементами, что такое очереди и как в них добавлять функции, какие виды анимаций доступны в стандартном функционале, а так же как анимационно скрыть, переместить, увеличить и т.д., интересующие блоки HTML страниц.


Урок 7. jQuery события. Часть 1:
От автора: любое веб-приложение должно быть интерактивным — то есть соответствующим образом реагировать на действия пользователя – к примеру, клик мышью по кнопке, наведение мыши на некоторый блок, изменение значение полей и т.д. Поэтому в данном уроке мы поговорим с Вами о методах библиотеки, благодаря которым можно обрабатывать различные jQuery события.
По итогам данного урока Вы научитесь обрабатывать различные события, используя методы библиотеки jQuery, а значит сможете создавать интерактивные веб-приложения.


Урок 8. События. Часть 2:
От автора: в данном видео мы продолжаем изучать методы регистрирующие обработчики различных событий. А именно познакомимся с событиями браузера и событиями загрузки документа то есть страницы ,а так же рассмотрим универсальные методы которые используются для назначения обработчиков уже изученных событий.
По итогам данного урока Вы научитесь использовать универсальные методы регистрации обработчиков для различных событий, а так же узнаете, что такое делегирование событий и как данный механизм реализуется.


Урок 9. Методы работы с набором выбранных элементов. Часть 1:
От автора: Вы уже знаете, что работа с библиотекой jQuery сводится изначально к выборке необходимых элементов. При этом в выборку может входить как один элемент так и несколько и не всегда все они нужны для реализации намеченного функционала. Более того, бывают ситуации, когда не получается выбрать необходимый элемент, а выбирается наиболее близкий к интересующему. Все это так или иначе приводит к необходимости обработки выборки, то есть к непосредственной работе с элементами входящей в ее состав . К примеру поиск, фильтрация, удаление, формирование новой выборки и т.д. Поэтому в данном уроке мы изучим методы JQuery по работе с набором выбранных элементов.
По итогам данного урока Вы научитесь программно перемещаться по дереву DOM, а также узнаете, как найти родительские, дочерние или соседние элементы, используя набор выбранных элементов.


Урок 10. Методы работы с набором выбранных элементов. Часть 2:
От автора: на прошлом уроке мы изучили методы работы с набором выбранных элементов. А именно – научились перемещаться по дереву DOM. Сегодня мы познакомимся с методами фильтрами, которые предоставляют доступ к определенным элементам выборки, рассмотрим методы циклического обхода набора и изучим несколько вспомогательных инструментов по данной теме.
По итогам данного урока Вы научитесь фильтровать набор выбранных элементов по заданным условиям, циклически обходить выборку, то есть описывать код функции, которая будет вызвана для каждого элемента набора, а также добавлять дополнительные элементы в выборку.


Урок 11. jQuery. Работа AJAX. Часть 1:
От автора: в данное время огромнейшей, популярностью пользуются интерактивные веб-проекты, которые общаются с веб-сервером в фоне, то есть без перезагрузки страницы в целом и это не удивительно, так как вышеуказанные приложения значительно быстрее и удобны в работе. Поэтому в данном уроке мы с Вами начнем учиться работать с методом AJAX, используя библиотеку jQuery.
Данный урок – практический, в котором мы создадим несложный скрипт записи добавленной в форму, информации в базу данных. При этом отправка информации на сервер, реализуется без перезагрузки страницы. Соответственно, Вы узнаете как работать с jquery AJAX, какие методы используются для отправки запроса и какие важные параметры необходимо определить, при формировании запроса.


Урок 12. jQuery. Работа AJAX. Часть 2:
От автора: в данном видео мы с Вами продолжаем изучать доступные методы библиотеки jQuery по работе с AJAX. При этом напомню, что базовый метод мы с Вами рассмотрели, но не успели изучить основные параметры объекта настроек запроса, а так же дополнительные методы по отправке асинхронного запроса на сервер.
По итогам данного урока Вы изучите дополнительные методы по отправке запроса, а так же научитесь формировать обработчики для основных событий AJAX.


Урок 13. jQuery. Утилиты. Часть 1:
От автора: приветствую Вас дорогой друг. Библиотека jQuery в своем составе содержит огромный набор вспомогательных методов – утилитов, которые используются для выполнения различных преобразований над интересующими данными. Поэтому в данном уроке мы начнем изучать указанные методы.
По итогам данного урока Вы научитесь работать с массивами, а именно выполнять объединение, описывать функцию, которая будет выполнена для каждого элемента, а так же формировать сортировку элементов по определенной дополнительной функции. Так же Вы рассмотрите методы при помощи которых, можно организовать проверку типа данных интересующего значения.


Урок 14. jQuery. Утилиты. Часть 2:
От автора: приветствую Вас дорогой друг. В данном уроке мы продолжим рассматривать методы из категории утилитов библиотеки jQuery. При этом Вы узнаете как объекты jquery превратить в массивы и использовать методы присущие этому типу данных, как сформировать новый массив, используя функцию, которая будет вызываться для каждого элемента массива или объекта, как выполнить слияние двух объектов выбранных элементов страницы, как преобразовать строку формата JSON, или HTML в объект и наконец, как для определенного метода задать конкретный контекст вызова и какие преимущества мы из этого получим.


Урок 15. jQuery. Игра крестики-нолики. Часть 1:
От автора: на текущий момент времени мы с Вами изучили абсолютно всю запланированную теорию и, соответственно, курс можно считать законченным. Но подвести черту я бы хотел небольшим практическим заданием, благодаря которому Вы закрепите полученные знания.
Поэтому в данном и следующем уроке мы с Вами создадим несложную браузерную игру под названием крестики нолики. Крестики-нолики – это логическая игра для двух игроков на квадратном поле 3 на 3 клетки. Один из игроков играет крестиками, второй – ноликами. Игроки на каждом ходе по очереди ставят на свободные клетки поля свои знаки. Первый, выстроивший в ряд три своих фигуры по вертикали, горизонтали или диагонали, выигрывает. В текущем видео мы сформируем необходимо игровое поле и предоставим возможность игрокам делать свои ходы.


Урок 16. jQuery. Игра крестики-нолики. Часть 2:
От автора: в данном видео мы продолжаем разрабатывать игру под названием крестики-нолики и, как Вы помните, игроки на данный момент времени могут ходить, то есть добавлять свои знаки на игровую поверхность, но нет возможности кому-то из них выиграть.
Таким образом, игра продолжается до тех пор, пока есть свободные клетки. Соответственно мы это с Вами сегодня исправим и реализуем несколько логических условий, благодаря которым после каждого хода будет проверяться возможность выигрыша одного из игроков.